<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<c:set var="ctx" value="${pageContext.request.contextPath}" />
<!DOCTYPE html>
<html>
<head>
<style type="text/css">
 span img:hover{
                transform: scale(1.4);/*鼠标放上之后元素变成1.4倍大小*/
            }
</style>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
  <title>采购</title>
  <link rel="stylesheet" href="${ctx}/static/layui/css/layui.css">
</head>
<body class="layui-layout-body">
    <div style="padding: 150px 0px 0px 300px;">

    	<!-- 上:采购入库 -->
    	<div style="margin-left: 220px;"><a href="#" id ="main" onclick="AddTab('采购入库','cgrk','${ctx}/order/in')" ><span><img src="${ctx}/static/img/cgrk.png"  ></span></a></div>
    	<!-- 左:供应商 -->
    	<div style="float:left;height: 152px;"><a href="#" onclick="AddTab('供应商','gys','${ctx}/supplier')"><span><img src="${ctx}/static/img/gys.png" height="200px;"></span></a></div>
    	<!-- 中 -->
    	<div style="float:left;padding: 70px 5px 0px 5px;"><img src="${ctx}/static/img/duijie.png" ></div>
    	<!-- 右:库存查询 -->
    	<div><a href="#" onclick="AddTab('库存查询','kccx','${ctx}/depot')"><span><img src="${ctx}/static/img/kccx.png" height="200px;"></span></a></div>
    	<!-- 下 :采购退货-->
    	<div style="margin-left: 220px;"><a href="#" onclick="AddTab('采购退货','cgth','${ctx}/order/out')"><span><img src="${ctx}/static/img/cgth.png"></span></a></div>
    </div>
<script src="${ctx}/static/layui/layui.js"></script>
<script>
//JavaScript代码区域
function AddTab(name,id,url)
{
	parent.layui.element.tabAdd('demo', {
		  title: name,
          content: '<iframe data-frameid="'+id+'" scrolling="auto" frameborder="0" src="'+url+'" style="width:100%;height:99%;"></iframe>',
		  id: id
		});
   	parent.layui.element.tabChange('demo',id);
}

</script>
</body>
</html>